<!DOCTYPE html>
<html>
<head>
    <title>Bar</title>
    <meta charset="utf-8">
    <meta name = "viewport" content = "initial-scale = 1, user-scalable = no">
    <script type="text/javascript" src="../src/JChart.js"></script>
    <script type="text/javascript" src="../src/JChart.Canvas.js"></script>
    <script type="text/javascript" src="../src/JChart.Chart.js"></script>
    <script type="text/javascript" src="../src/JChart.Scale.js"></script>
    <script type="text/javascript" src="../src/JChart.Bar.js"></script>
</head>
<body>
<canvas id="canvas1" height="600" width="800"></canvas>
<script type="text/javascript">
    var data = {
        labels : ["2012","二月","三月","四月","五月","六月","七月",'八月','九月','十月','十一月','十二月'],
        datasets : [
//            {
//                color : "rgba(220,220,220,0.5)",
//                borderColor : "rgba(220,220,220,1)",
//                data : [65,59,90,81,56,55,40,20,3,20,10,60,65,59,90,81,56,55,40,20,3,20,10,60,10,60,65]
//            },
            {
                color : "rgba(151,187,205,0.5)",
                borderColor : "rgba(151,187,205,1)",
                data : [28,48,40,19,96,27,200,40,40,70,11,89]
            }
        ]
    }
    var bar = new JChart.Bar(data,{
        id : 'canvas1',
        datasetGesture : true,
        datasetShowNumber : 6
    });
    bar.on('tap.bar',function(data,i,j){
        alert(JSON.stringify(data));
    });
    bar.on('longTap.bar',function(data,i,j){
        alert('longTap:'+data);
    });
    bar.draw();

</script>
</body>
</html>